<template>
  <div>
    <div style="position: fixed; left: 0; top: 0; right: 0; z-index: 9">
      <van-search v-model="value" shape="round" placeholder="LV" />
    </div>
    <div style="width: 95vw; margin: 8vh auto; display: flex">
      <div style="position: fixed; left: 0; top: 8vh; right: 0; z-index: 7">
        <van-sidebar v-model="active" style="width: 20vw">
          <van-sidebar-item
            v-for="item in data[0].Sidebar"
            :title="item.title"
            @click="changes()"
            style="height: 1.5vh; font-size: 12px; line-height: 1.5vh"
          />
        </van-sidebar>
      </div>
      <div style="margin-left: 20vw">
        <xiangQing :xq="xq"></xiangQing>
        {{ active }}
      </div>
    </div>

    <div style="height: 55px"></div>
  </div>
</template>
<script setup>
import xiangQing from "./comm/xiangQing.vue";
import { ref, reactive } from "vue";
const active = ref(0);
const data = reactive([
  {
    Sidebar: [
      {
        id: 1,
        title: "奢品专区",
      },
      {
        id: 2,
        title: "时尚女装",
      },
      {
        id: 3,
        title: "流行男装",
      },
      {
        id: 4,
        title: "礼品箱包",
      },
      {
        id: 5,
        title: "运动潮鞋",
      },
      {
        id: 6,
        title: "户外野营",
      },
      {
        id: 7,
        title: "时尚美妆",
      },
      {
        id: 8,
        title: "潮玩数码",
      },
      {
        id: 9,
        title: "营养保健",
      },
      {
        id: 10,
        title: "男女拖鞋",
      },
      {
        id: 11,
        title: "珠宝首饰",
      },
      {
        id: 12,
        title: "母婴用品",
      },
      {
        id: 13,
        title: "食品酒水",
      },
      {
        id: 14,
        title: "家具生活",
      },
    ],
  },

  [
    {
      id: 1,
      titles: "国际大牌",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "时尚女士",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "品质男士",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
  ],

  [
    {
      id: 1,
      titles: "ssss",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "vvvvv",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "xxxx",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
  ],

  [
    {
      id: 1,
      titles: "qqqqq",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "wwww",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "dddd",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
  ],
  [
    {
      id: 1,
      titles: "eee",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "rrrr",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "ttt",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    ],
  [
            {
                id: 1,
                titles: "iiii",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "uuu",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "yyy",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "dddd",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "pppp",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "ooo",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "hhhh",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "gggg",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "ffff",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "kkkk",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "jjjj",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "nnnn",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
          [
    {
      id: 1,
      titles: "qqqqq",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "wwww",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "dddd",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
  ],
  [
    {
      id: 1,
      titles: "eee",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 2,
      titles: "rrrr",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    {
      id: 3,
      titles: "ttt",
      xiangq: [
        {
          id: 1,
          title: "路易威登",
          url: require("@/assets/img/login/l1.png"),
        },
        {
          id: 2,
          title: "古驰",
          url: require("@/assets/img/login/l2.png"),
        },
        {
          id: 3,
          title: "罗意威",
          url: require("@/assets/img/login/l3.png"),
        },
        {
          id: 4,
          title: "迪奥",
          url: require("@/assets/img/login/l4.png"),
        },
        {
          id: 5,
          title: "赛琳",
          url: require("@/assets/img/login/l5.png"),
        },
        {
          id: 6,
          title: "香奈儿",
          url: require("@/assets/img/login/l6.png"),
        },
        {
          id: 7,
          title: "汤姆.福特",
          url: require("@/assets/img/login/l7.png"),
        },
        {
          id: 8,
          title: "宝格丽",
          url: require("@/assets/img/login/l8.png"),
        },
        {
          id: 9,
          title: "蒂凡尼",
          url: require("@/assets/img/login/l9.png"),
        },
      ],
    },
    ],
  [
            {
                id: 1,
                titles: "iiii",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "uuu",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "yyy",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "dddd",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "pppp",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "ooo",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "hhhh",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "gggg",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "ffff",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
    ],
        [
            {
                id: 1,
                titles: "kkkk",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 2,
                titles: "jjjj",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
            {
                id: 3,
                titles: "nnnn",
                xiangq: [
                    {
                        id: 1,
                        title: "路易威登",
                        url: require('@/assets/img/login/l1.png'),
                    },
                    {
                        id: 2,
                        title: "古驰",
                        url: require('@/assets/img/login/l2.png'),
                    },
                    {
                        id: 3,
                        title: "罗意威",
                        url: require('@/assets/img/login/l3.png'),
                    },
                    {
                        id: 4,
                        title: "迪奥",
                        url: require('@/assets/img/login/l4.png'),
                    },
                    {
                        id: 5,
                        title: "赛琳",
                        url: require('@/assets/img/login/l5.png'),
                    },
                    {
                        id: 6,
                        title: "香奈儿",
                        url: require('@/assets/img/login/l6.png'),
                    },
                    {
                        id: 7,
                        title: "汤姆.福特",
                        url: require('@/assets/img/login/l7.png'),
                    },
                    {
                        id: 8,
                        title: "宝格丽",
                        url: require('@/assets/img/login/l8.png'),
                    },
                    {
                        id: 9,
                        title: "蒂凡尼",
                        url: require('@/assets/img/login/l9.png'),
                    },
                ],
            },
        ],
]);
const xq = ref();
xq.value=data[1]
const changes = () => {
  setTimeout(() => {
    (xq.value = ""), 
    xq.value = data[active.value + 1];
    clearTimeout;
  }, 10);
};
</script>
<style lang="scss">
.m {
  display: flex;
}
</style>
